<template>
	<view>
		<view class="margin-top-xl">
			<view v-if="config.site_title" class="flex align-center justify-center flex-direction padding-xl margin-top-lg">
				<image v-if="config.site_title" :src="main_model.icon ? main_model.icon : ''" mode="aspectFill"
					style="background-color: #f4f5f6;width: 160rpx;height: 160rpx;" class="round"></image>
				<view class="text-bold text-xxl text-orange padding-tb"> {{ main_model.title ? main_model.title : '专业版' }} </view>
				<view style="width: 650rpx;" class="padding-bottom" v-if="config.home_notice">
					<u-notice-bar :text="config.home_notice" mode="closable"></u-notice-bar>
				</view>
				<view class="cu-card bg-gradual-blue padding shadow-blur radius text-lg"
					style="line-height: 1.5;text-align: justify;">
					{{ main_model.description ? main_model.description : '你好，欢迎体验智财小屋！我是人工智能胖大海，并经过至今最新的财税法律方面专门训练，因此我可以回答你在财税领域所有的问题，如您有使用问题，可以查阅个人中心-使用指南！' }}
				</view>
			</view>
		</view>
		<view class="flex justify-center align-center flex-direction">
			<button @click="toChat" style="width: 650rpx;height: 100rpx;" class="cu-btn lines-orange text-bold round">
				开始咨询 (余{{num}}次) </button>
		</view>
		<!-- <view class="flex justify-center align-center flex-direction padding-top">
			<button @click="toTax" style="width: 650rpx;height: 100rpx;" class="cu-btn lines-orange text-bold round">
				胖智达（智税咨询） </button>
		</view> -->
		<view class="tool padding-top-xl">
			<view class="header">
				<view class="title text-bold">功能特性</view>
			</view>
			<u-transition :show="true" mode="slide-up">
				<view class="grid">
					<view class="item">
						<view class="icon">
							<u-icon size="28"
								name="https://img.alicdn.com/imgextra/i1/2064565174/O1CN01v7Y9311o5k2r5Rwaq_!!2064565174.png">
							</u-icon>
						</view>
						<view class="title">AI回答</view>
						<view class="desc">浩繁法条直取答案</view>
					</view>
					<view class="item">
						<view class="icon">
							<u-icon size="28"
								name="https://img.alicdn.com/imgextra/i1/2064565174/O1CN01H200mY1o5k2ythU1B_!!2064565174.png">
							</u-icon>
						</view>
						<view class="title">智能答案</view>
						<view class="desc">免去千篇一律</view>
					</view>
					<view class="item">
						<view class="icon">
							<u-icon size="28"
								name="https://img.alicdn.com/imgextra/i1/2064565174/O1CN01FDSoxG1o5k2xjTHUD_!!2064565174.png">
							</u-icon>
						</view>
						<view class="title">精准定位</view>
						<view class="desc">免去繁琐搜索</view>
					</view>
					<view class="item">
						<view class="icon">
							<u-icon size="28"
								name="https://img.alicdn.com/imgextra/i4/2064565174/O1CN01UP4ksa1o5k2rDpdOP_!!2064565174.png">
							</u-icon>
						</view>
						<view class="title">引导提示</view>
						<view class="desc">AI发散思维</view>
					</view>
					<view class="item">
						<view class="icon">
							<u-icon size="28"
								name="https://img.alicdn.com/imgextra/i2/2064565174/O1CN01Oep4C01o5k2zlWs2q_!!2064565174.png">
							</u-icon>
						</view>
						<view class="title">安全限制</view>
						<view class="desc">道德逻辑自洽</view>
					</view>
					<view class="item">
						<view class="icon">
							<u-icon size="28"
								name="https://img.alicdn.com/imgextra/i1/2064565174/O1CN01onUFC01o5k2uPHOqj_!!2064565174.png">
							</u-icon>
						</view>
						<view class="title">在线工具</view>
						<view class="desc">无需下载软件</view>
					</view>
				</view>
			</u-transition>
		</view>
		<view class="padding-tb" v-if="config.copyright">
			<u-loadmore :line="true" status="loadmore" :loadmoreText="config.copyright" color="#909399"></u-loadmore>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {

			}
		},
		computed: {
			...mapState(['config', 'num', 'userInfo', 'token', 'main_model'])
		},
		onLoad(op) {
			// #ifdef MP-WEIXIN
			uni.showLoading({
				title: "同步服务器状态..."
			})
			uni.login({
				success: (res) => {
					console.log(res)
					this.$request('/api/Member/wxMpQuickLogin', 'POST', {
						code: res.code
					}).then(rs => {
						console.log(rs)
						uni.setStorageSync('userInfo', rs.data)
						uni.setStorageSync('token', rs.token)
						rs.data.token = rs.token
						this.$store.commit('login', rs.data);
						uni.hideLoading()
						// 如果服务端校验是新用户且存在分享人id，那么调用奖励接口
						if (rs.data.is_new && op.share_m_id) {
							console.log('分享人id：', op.share_m_id)
							this.$request('/api/Member/bindShareId', 'POST', {
								share_m_id: op.share_m_id
							}).then(ret => {
								console.log(ret)
								if (ret.status == 200) {
									uni.showModal({
										title: "温馨提示",
										content: ret.msg
									})
								}
							})
						}
					}).catch(err => {
						uni.hideLoading()
						console.log(err)
						this.$failToast(err, 'error')
					})
				}
			})
			// #endif
		},
		onShareAppMessage() {
			console.log('转发+1')
		},
		methods: {
			toChat() {
				uni.navigateTo({
					url: "./index?model=" + JSON.stringify(this.main_model)
				})
			},
			toTax() {
				uni.showModal({
					content: "待开放，模型训练中..."
				})
			}
		}
	}
</script>
<style>
	/*每个页面公共css */
	@import url("@/static/style/color-ui.css");
</style>

<style lang="scss">
	.tool {
		width: 90%;
		margin: 15rpx auto;

		.header {
			.title {
				margin-bottom: 30rpx;
			}
		}

		.grid {
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			justify-content: space-between;

			.item {
				width: 30%;
				display: flex;
				flex-direction: column;
				align-items: center;
				background-color: #F0FAF8;
				margin: 15rpx 0rpx;
				padding: 30rpx 0rpx;
				border-radius: 10rpx;

				.title {
					color: #1B2B20;
					margin-top: 15rpx;
				}

				.desc {
					color: #67776C;
					font-size: 24rpx;
				}
			}
		}
	}
</style>
